<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path:'/manage' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>商品管理</el-breadcrumb-item>
      <el-breadcrumb-item>商品分类管理</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="w">
      <el-card :body-style="{padding: '10px'}" shadow="never">
        <el-tree
          :data="treeClassifyData"
          :props="defaultProps"
          default-expand-all
          node-key="id"
          ref="tree">
        </el-tree>
      </el-card>
    </div>
  </div>
</template>

<script>
export default {
  name: 'goods-classify',
  data () {
    return {
      treeClassifyData: [], // 树组件数据，商品分类数据，最终数据
      defaultProps: {
        label: 'name',
        children: 'children'
      } // 树组件配置
    }
  },
  methods: {
    arrUtil (arr) {
      for (let i = 0; i < arr.length; i++) {
        if (typeof arr[i] === 'undefined' || arr[i] === '') {
          arr.splice(i, 1)
          i--
        }
      }
    }
  },
  created () {
    this.$ajax.get('//192.168.0.107:8080/goods/getGoodsCategoryList').then((res) => {
      let parentList = []
      res.data.data.parentGoodsCategoryList.forEach((item, index) => {
        parentList[item.id] = item
        parentList[item.id].children = []
      })
      res.data.data.childGoodsCategoryList.forEach((item, index) => {
        parentList[item.parentId].children.push(item)
      })
      this.arrUtil(parentList)
      this.treeClassifyData = parentList
      console.log(this.treeClassifyData)
    }).catch((err) => {
      console.log(err)
    })
    // let params = {
    //   name: 'zzf',
    //   description: '就是做饭的',
    //   parentId: 24,
    //   branchId: 1,
    //   status: 1
    // }
    // this.$ajax.post('//192.168.0.107:8080/goods/addGoodsCategory', JSON.stringify(params)).then((res) => {
    //   console.log(res)
    // }).catch((err) => {
    //   console.log(err)
    // })
  }
  // //192.168.0.107:8080/goods/getGoodsCategoryList goods/addGoodsCategory 分类名，描述，pid，branchId，status goods/modifyGoodsCategory
}
</script>

<style scoped>

</style>
